<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>JSDoc: Source: models/ArrowShape.js</title>
    
    <script src="scripts/prettify/prettify.js"> </script>
    <script src="scripts/prettify/lang-css.js"> </script>
    <!--[if lt IE 9]>
      <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    <link type="text/css" rel="stylesheet" href="styles/prettify-tomorrow.css">
    <link type="text/css" rel="stylesheet" href="styles/jsdoc-default.css">
</head>

<body>

<div id="main">
    
    <h1 class="page-title">Source: models/ArrowShape.js</h1>
    
    


    
    <section>
        <article>
            <pre class="prettyprint source"><code>/**
 * @author Bart van Vliet - bart@dobots.nl
 */

/**
 * An arrow with line and triangular head, based on the navigation arrow.
 * Aims to the left at 0 rotation, as would be expected.
 *
 * @constructor
 * @param options - object with following keys:
 *   * size (optional) - the size of the marker
 *   * strokeSize (optional) - the size of the outline
 *   * strokeColor (optional) - the createjs color for the stroke
 *   * fillColor (optional) - the createjs color for the fill
 *   * pulse (optional) - if the marker should "pulse" over time
 */
ROS2D.ArrowShape = function(options) {
	var that = this;
	options = options || {};
	var size = options.size || 10;
	var strokeSize = options.strokeSize || 3;
	var strokeColor = options.strokeColor || createjs.Graphics.getRGB(0, 0, 0);
	var fillColor = options.fillColor || createjs.Graphics.getRGB(255, 0, 0);
	var pulse = options.pulse;
	
	// draw the arrow
	var graphics = new createjs.Graphics();
	
	var headLen = size / 3.0;
	var headWidth = headLen * 2.0 / 3.0;
	
	graphics.setStrokeStyle(strokeSize);
	graphics.beginStroke(strokeColor);
	graphics.moveTo(0, 0);
	graphics.lineTo(size-headLen, 0);
	
	graphics.beginFill(fillColor);
	graphics.moveTo(size, 0);
	graphics.lineTo(size-headLen, headWidth / 2.0);
	graphics.lineTo(size-headLen, -headWidth / 2.0);
	graphics.closePath();
	graphics.endFill();
	graphics.endStroke();
	
	// create the shape
	createjs.Shape.call(this, graphics);
	
	// check if we are pulsing
	if (pulse) {
		// have the model "pulse"
		var growCount = 0;
		var growing = true;
		createjs.Ticker.addEventListener('tick', function() {
			if (growing) {
				that.scaleX *= 1.035;
				that.scaleY *= 1.035;
				growing = (++growCount &lt; 10);
			} else {
				that.scaleX /= 1.035;
				that.scaleY /= 1.035;
				growing = (--growCount &lt; 0);
			}
		});
	}
};
ROS2D.ArrowShape.prototype.__proto__ = createjs.Shape.prototype;
</code></pre>
        </article>
    </section>




</div>

<nav>
    <h2><a href="index.html">Index</a></h2><h3>Classes</h3><ul><li><a href="ROS2D.ArrowShape.html">ArrowShape</a></li><li><a href="ROS2D.Grid.html">Grid</a></li><li><a href="ROS2D.NavigationArrow.html">NavigationArrow</a></li><li><a href="ROS2D.OccupancyGrid.html">OccupancyGrid</a></li><li><a href="ROS2D.OccupancyGridClient.html">OccupancyGridClient</a></li><li><a href="ROS2D.OccupancyGridSrvClient.html">OccupancyGridSrvClient</a></li><li><a href="ROS2D.PanView.html">PanView</a></li><li><a href="ROS2D.PathShape.html">PathShape</a></li><li><a href="ROS2D.PolygonMarker.html">PolygonMarker</a></li><li><a href="ROS2D.TraceShape.html">TraceShape</a></li><li><a href="ROS2D.Viewer.html">Viewer</a></li><li><a href="ROS2D.ZoomView.html">ZoomView</a></li></ul><h3>Global</h3><ul><li><a href="global.html#ROS2D">ROS2D</a></li></ul>
</nav>

<br clear="both">

<footer>
    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.2.0-dev</a> on Mon Jul 28 2014 11:21:38 GMT-0400 (EDT)
</footer>

<script> prettyPrint(); </script>
</body>
</html>
